import 'package:cat_eye/base/base_refresh_state.dart';
import 'package:cat_eye/root_page/find_page/find_classification_details_widget.dart';
import 'package:cat_eye/util/util.dart';
import 'package:cat_eye/view_model/find_view_model/find_classifcoation_view_model.dart';
import 'package:flutter/material.dart';

/*
* @Package: root_page.find_page
* @ClassName: find_classification_widget
* @Author: szj
* @CreateDate: 8/2/21 3:21 PM
* TODO 分类页面
*/
class FindClassificationWidget extends StatefulWidget {
  const FindClassificationWidget({Key key}) : super(key: key);

  @override
  _FindClassificationWidgetState createState() =>
      _FindClassificationWidgetState();
}

class _FindClassificationWidgetState extends BaseRefreshState<
    FindClassificationWidget, FindClassificationViewModel> {
  @override
  FindClassificationViewModel get buildViewModel =>
      FindClassificationViewModel();

  @override
  Widget buildWidget(BuildContext context, FindClassificationViewModel model) {
    return GridView.builder(
        itemCount: model.itemList.length,
        gridDelegate:
            SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
        itemBuilder: (context, index) {
          return InkWell(
            onTap: () {
              Navigator.push(
                  context, router(widget: FindClassificationDetailsWidget(model.itemList[index])));
            },
            child: Container(
              padding: EdgeInsets.all(5),
              width: MediaQuery.of(context).size.width / 2,
              height: MediaQuery.of(context).size.width / 2,
              child: Stack(
                alignment: Alignment.center,
                children: [
                  cacheImage(model.itemList[index].bgPicture,
                      borderRadius: BorderRadius.circular(8)),
                  Text(
                    model.itemList[index].name,
                    style: TextStyle(
                        fontSize: 26,
                        color: Colors.white,
                        fontWeight: FontWeight.bold),
                  )
                ],
              ),
            ),
          );
        });
  }
}
